<template>
	<view class="accord">
		<view v-html="pageData.agreementContext"></view>
	</view>
</template>

<script lang="ts" setup>
	import {
		onLoad,
		onReady,
	} from '@dcloudio/uni-app'
	import {
		reactive,
		ref
	} from 'vue';
	import {
		getAgreement
	} from '../../api/index';

	const pageData = reactive<{ name : string, agreementContext : string }>({
		name: '',
		agreementContext: ''
	})

	const getAccord = async (agreementId : string) => {
		const {
			data
		} = await getAgreement({
			agreementId
		})
		pageData.name = data.name
		pageData.agreementContext = data.agreementContext

		// #ifdef MP-WEIXIN
		pageData.agreementContext = data.agreementContext.replace(/style="[^"]+"/gi, "")
			.replace(/style='[^']+'/gi, "")
			.replace(/(<!--(.|[\r\n])*?-->)/gi, "")
			.replace(/<xml[^>]*>(.|\n)*<\/xml>/gi, "")
			.replace(/undefined/gi, "")
		// #endif

		if (pageData.name) {
			uni.setNavigationBarTitle({
				title: pageData.name
			})
		}
	}

	onLoad((option) => {
		if (option && option.agreementId) {
			getAccord(option.agreementId)
		}
	})
</script>

<style lang="scss" scoped>
	.accord {
		width: calc(100% - 48rpx);
		margin: 0 auto;
		min-height: 100vh;
		background-color: #fff;
	}
</style>